<template>
    <div style="width: 100vh; height: 100vh; margin: 0 auto">
        <h1>您的订单 {{ id }} 已支付成功，再次感谢您为《 {{ title }} 》的打榜</h1>
        <h3>{{ countDown }} 秒后将带您返回详情页面</h3>
        <img :src="require('./../assets/xiexie.gif'.replace('on','off'))" style="width:400px;height:400px;" />
    </div>
</template>

<script setup>
import {ref, onMounted, onBeforeUnmount, getCurrentInstance} from 'vue';
import router from "@/router";

const id = ref(null);
const title = ref(null);
const noteId = ref(null);
const countDown = ref(5);

const urlParams = new URLSearchParams(window.location.search);
id.value = urlParams.get('id');
noteId.value = urlParams.get('noteId');
title.value = decodeURIComponent(urlParams.get('title'));

const countdownInterval = setInterval(() => {
    countDown.value--;
    if (countDown.value === 0) {
        // 在5秒后执行关闭页面的操作
        closePage();
        // 跳转到详情页面
        // router.push('/detail?id='+noteId.value);
    }
}, 1000);

const closePage = () => {
    clearInterval(countdownInterval);
    // 使用 window.close() 关闭当前页面
    window.close();
};

onBeforeUnmount(() => {
    clearInterval(countdownInterval);
})



</script>

<style scoped>
/* 样式 */
</style>